<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<title>书刊检索</title>
		
		<!-- Bootstrap依赖的样式和脚本 -->
		<link href="css/bootstrap.min.css" rel="stylesheet">
		<link rel="shortcut icon" href="./images/favicon.png" type="image/x-icon">
		<script src="js/jquery-1.11.1.min.js"></script>
		<script src="js/bootstrap.min.js"></script>
		<style type="text/css">
			*{
				text-decoration: ;
			}
			#info a{
				color: #000;
				text-decoration: none;
			}
			#info a:focus{
				text-decoration: none;
			}
			#info a:hover{
				text-decoration: none;
			}
		</style>
	</head>
	<body>
		<div class="container-fluid" style="margin-top: 150px;">
			<div class="row">
				<div class="col-lg-12 text-center" style="">
					<h3 style="font-size: 36px; color: #000000; background: url(img/title.png) no-repeat center;">
						<a href="javascript:void(0)" class="notice" style="color: #000000;">书刊检索</a>
					</h3>
					<p style="font-size: 16px; color: #666666; margin-top: 12px;">发挥书籍正确导向，充分了解世界与我们</p>
				</div>
			</div><br>
			<div class="row">
				<div class="col-lg-6 col-lg-offset-3">
					<div class="input-group">
					  <div class="input-group-btn">
						<button id="info" type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" style="width: 150px; text-decoration: none;">任意词 <span class="caret"></span></button>
						<ul id="lists" class="dropdown-menu">
							<li><a href="#">任意词</a></li>
							<li><a href="#">书名</a></li>
							<li><a href="#">作者</a></li>
							<li><a href="#">ISBN</a></li>
							<li role="separator" class="divider"></li>
							<li><a href="#">索引号</a></li>
							<li><a href="#">分类号</a></li>
							<li><a href="#">主题词</a></li>
							<li><a href="#">丛书名</a></li>
						</ul>
					  </div>
					  <input type="text" class="form-control" aria-label="Amount (to the nearest dollar)">
					  <span class="input-group-addon" style="width: 55px; background: url(img/Lisearch.png) no-repeat center #009688; background-size: 40% 60%;" onclick="history()"></span>
					</div>
				</div>	
			</div>
		</div>
		<script type="text/javascript">
			window.onload = function change(){
				var list = document.getElementById("lists").getElementsByTagName("li");
				for(var i=0; i<list.length; i++){
					list[i].onclick = function(){
						$("#info").html(this.innerHTML + ' <span class="caret"></span>');
					}
				}
			}
			// 查找跳转读者历史
			function history(){
				this.location = "searchBooks.html";
			}
		</script>
	</body>
</html>
